<!DOCTYPE html>
<html>
	<script type="text/javascript" src="js/mainAI.js"></script>
	<script type="text/javascript">
		var allowSys = false;
		var currActive = '';
		var box1Val = 3;
		var box2Val = 5;
		var box3Val = 7;
		var box1Valtmp = 3;
		var box2Valtmp = 5;
		var box3Valtmp = 7;
		//var ai = new AI();
		function take1(box){
			if(currActive != box){
				resetBoxes();
				currActive = box;
			}
			if(box == 'box1' && box1Valtmp > 0){
				box1Valtmp = box1Valtmp - 1;
			}
			if(box == 'box2' && box2Valtmp > 0){
				box2Valtmp = box2Valtmp - 1;
			}
			if(box == 'box3' && box3Valtmp > 0){
				box3Valtmp = box3Valtmp - 1;
			}
			updateBoxes();
		}
		function updateBoxes(){
			document.getElementById('box1').value = box1Valtmp;
			document.getElementById('box2').value = box2Valtmp;
			document.getElementById('box3').value = box3Valtmp;
		}
		function resetBoxes(){
			box1Valtmp = box1Val;
			box2Valtmp = box2Val;
			box3Valtmp = box3Val;
		}
		function onButtonSubmitHere(){
			if(box1Val == box1Valtmp && box2Val == box2Valtmp && box3Val == box3Valtmp){
				alert('Please enter a move');
				return;
			}
			box1Val = box1Valtmp;
			box2Val = box2Valtmp;
			box3Val = box3Valtmp;
			if(checkWinCondition()){
				alert('You win');
				onButtonSubmitClear();
			} else
				setTimeout( "callAI();", 1250); 
		}
		function callAI(){
			var result = processMove(box1Val+''+box2Val+''+box3Val);
			sysout(result);
			var oldVal = parseInt(result.split('-')[0]);
			var newVal = parseInt(result.split('-')[1]);
			if(box1Val==oldVal){
				box1Val = newVal;
				box1Valtmp = newVal;
			} else if(box2Val==oldVal){
				box2Val = newVal;
				box2Valtmp = newVal;
			} else if(box3Val==oldVal){
				box3Val = newVal;
				box3Valtmp = newVal;
			}
			updateBoxes();
			if(!checkWinCondition())
				//enableButtons();
				sysout('going strong');
			else {
				alert('You lost');
				onButtonSubmitClear();
			}
		}
		function checkWinCondition(){
			return ( (box1Val==0 && box2Val==0 && box3Val==1)
				|| (box1Val==0 && box3Val==0 && box2Val==1)
				|| (box3Val==0 && box2Val==0 && box1Val==1) );
		}
		function onButtonSubmitClear(){
			document.getElementById('sysout').value = '';
		}
		function restart(){
			box1Val = box1Valtmp = 3;
			box2Val = box2Valtmp = 5;
			box3Val = box3Valtmp = 7;
			updateBoxes();
		}
	</script>
<head>
</head>
<body>

	<div id="opArea">
		<table border="0" align="center">
			<tr>
			<td align="center"><input type="text" id="box1" value="3" disabled style="width:20px" maxlength="1" /></td>
			<td align="center"><input type="text" id="box2" value="5" disabled style="width:20px" maxlength="1" /></td>
			<td align="center"><input type="text" id="box3" value="7" disabled style="width:20px" maxlength="1" /></td>
			<tr>
			<tr>
			<td align="center"><input type="button" id="buttonBox1" value="box1" onclick="take1('box1')" /></td>
			<td align="center"><input type="button" id="buttonBox2" value="box2" onclick="take1('box2')" /></td>
			<td align="center"><input type="button" id="buttonBox3" value="box3" onclick="take1('box3')" /></td>
			<tr>
			<tr>
			<td></td>
			<td align="center"><input type="button" id="buttonEval" value="Evaluate" onclick="onButtonSubmitHere()" /></td>
			<td></td>
			<tr>
			<tr>
			<td></td>
			<td align="center"><input type="button" id="buttonRestart" value="Restart" onclick="restart()" /></td>
			<td></td>
			<tr>
		</table>
		<br>
		<br>
		<br><div align="center"><textarea id="sysout" rows="1" cols="5" disabled ></textarea>
		</div>
	</div>

</body>
</html>
